<template>
  <div class="look">
    <div class="lookAll">
      <!-- {{modData}}  -->
      <!-- 字典 -->
      <dictionaries
        :searchData="attributeOrder"
        :modelType="modelType"
        @optionData="dictionariesCallBack"
      ></dictionaries>
      <div class="list" v-for="(item, index) in attributeOrder" :key="index">
        <span class="fon">{{ item.CN }}:</span>
        <span class="inb" v-if="item.type === 'select'"
          >{{
            optionDatass(
              item.typeGroupCode
                ? optionsZi[item.EN]
                : searchOptionTable[item.EN],
              modData[item.EN],
              item.EN
            )
          }}
        </span>
        <span class="inb" v-else>{{ modData[item.EN] }}</span>

        <!-- <span class="inb">{{modData[item.EN]}}</span> -->
      </div>
    </div>
  </div>
</template>
<script>
// 引入字典
import { dictionaries } from "@/views/components/FLPage";
import {
  getUserDetails, //用户详情
} from "@/api/waterAnalysis/flWaterMeterRecord/index";
export default {
  name: "examineWater",
  data() {
    return {
      modelType: "table",
      optionsZi: [],
      searchOptionTable: [],
      // attributeOrder:
      // [
      //   {
      //     EN: "contacts",
      //     CN: "用户名"
      //   },
      //   {
      //     EN: "housename",
      //     CN: "小区名称"
      //   },
      //   {
      //     EN: "sellerarea",
      //     CN: "营业厅"
      //   },
      //   {
      //     EN: "setupAddress",
      //     CN: "地址"
      //   },
      //   {
      //     EN: "size",
      //     CN: "口径"
      //   },
      //   {
      //     EN: "waterproperty",
      //     CN: "用水性质"
      //   },
      //   {
      //     EN: "phone",
      //     CN: "电话号"
      //   },
      //   {
      //     EN: "iccid",
      //     CN: "iccid"
      //   },
      //   {
      //     EN: "imei",
      //     CN: "imei"
      //   },
      //   {
      //     EN: "imsi",
      //     CN: "imsi"
      //   },
      //   {
      //     EN: "readNumDate",
      //     CN: "抄见时间"
      //   },
      //   {
      //     EN: "readNum",
      //     CN: "最新抄见值"
      //   },
      //   {
      //     EN: "use_count",
      //     CN: "本月累计"
      //   },
      //   {
      //     EN: "total",
      //     CN: "本年累计"
      //   },
      //   {
      //     EN: "lastUseCount",
      //     CN: "上月同期"
      //   },
      // ],
      attributeOrder: [
        {
          EN: "accountName",
          CN: "用户名",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          // dictTable:{
          //   table:'fl_customer_info',
          //   id:'id',
          //   name:'customer_name'
          // },
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "communityCode",
          CN: "小区名称",
          value: "",
          type: "select",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: false,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
          dictTable: {
            table: "fl_community",
            id: "code",
            name: "name",
          },
        },
        // {
        //   EN: "sellerarea",
        //   CN: "营业厅",
        //   value: "",
        //   type: "input",
        //   option: [],
        //   Exp: "^.{3,20}$",
        //   err: "长度为3-20的所有字符!",
        //   result: true,
        //   sign: true,
        //   searchSign: false,
        //   addSign: false,
        //   tableSign: false,
        //   examineSign: true,
        //   examineDisabled: false,
        //   modificationSign: true
        // },
        {
          EN: "setupAddress",
          CN: "地址",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: true,
          addSign: false,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "size",
          CN: "水表口径",
          value: "",
          type: "select",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          typeGroupCode: "caliber_style",
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: false,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "waterproperty",
          CN: "用水性质",
          value: "",
          type: "select",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          dictTable: {
            table: "fl_water_use_property",
            id: "id",
            name: "name",
          },
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: false,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "phone",
          CN: "联系电话",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "iccid",
          CN: "ICCID",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: false,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "imei",
          CN: "IMEI号",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: true,
          addSign: true,
          tableSign: true,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "imsi",
          CN: "imsi串号",
          // CN: "NB表imsi串号",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: false,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "lastUsing",
          CN: "本月累计",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: false,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "lastupdatetime",
          CN: "抄见日期",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: false,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
        {
          EN: "readnum",
          CN: "最新抄见值",
          value: "",
          type: "input",
          option: [],
          Exp: "^.{3,20}$",
          err: "长度为3-20的所有字符!",
          result: true,
          sign: true,
          searchSign: false,
          addSign: false,
          tableSign: false,
          examineSign: true,
          examineDisabled: false,
          modificationSign: true,
        },
      ],
      modData: {},
    };
  },
  components: {
    dictionaries,
  },
  props: ["userCode"],
  created() {
    this.getdata();

    // this.DialogVisible=JSON.parse(JSON.stringify(this.DialogVisibleMod))
  },
  watch: {
    userCode: {
      deep: true,
      handler(newValue, oldValue) {
        this.userCode = newValue;
      },
    },
  },
  methods: {
    // 字典组件回调
    dictionariesCallBack([a = {}, b = {}]) {
      // 正常字典
      // 删除app抄表  特殊处理
      this.optionsZi = a;
      // a['metertype'].splice(0,1)
      // 跨表字典
      this.searchOptionTable = b;
      console.log(a, b, 66688);
    },
    async getdata() {
      let userCode = this.userCode;
      const res = await getUserDetails(userCode);
      // res[0]
      console.log(5555555555555555555555555);

      console.log(res, "用户详情结果");
      this.modData = res;
    },
  },
  computed: {
    // 字典计算属性
    optionDatass() {
      return function (arr, val, EN) {
        // console.log(arr,val,EN,'99999');

        // console.log(arr[val],'why');
        // 判断特殊

        if (arr) {
          for (let i = 0; i < arr.length; i++) {
            if (arr[i].value == val) {
              console.log(arr[i].value, arr[i].label, 669);
              return arr[i].label;
            }
          }
        }
      };
    },
    // 字典计算属性
    // optionDatass(){
    //   return function (arr,val,EN) {
    //     // console.log(arr,val,EN,'99999');

    //     // console.log(arr[val],'why');
    //     // 判断特殊
    //     if (EN =='sysCompanyCode') {
    //       const getFindByTypeData = this.getFindByTypeData
    //       console.log(getFindByTypeData,9999999999);

    //       for (let i = 0; i < getFindByTypeData.length; i++) {
    //         const element = getFindByTypeData[i];
    //         if (getFindByTypeData[i].sysCompanyCode == val) {
    //           return getFindByTypeData[i].name
    //         }
    //       }
    //     }
    //     if (arr) {
    //       for (let i = 0; i < arr.length; i++) {
    //         if(arr[i].value == val){
    //           // console.log(arr[i].label)
    //           return arr[i].label
    //         }
    //       }
    //     }
    //   }
    // }
  },
};
</script>
<style lang="scss" scoped>
.look {
  background-color: rgb(7, 121, 154);
  color: #ffffff;
  // overflow: hidden;
  .lookAll {
    // max-height: 500px;
    // overflow: hidden;
    width: 100%;
    display: block;
    //display: flex;
    // flex-wrap: wrap;
    padding: 10px;
    /* padding-top: 50px;
    padding-left: 25px; */

    .list {
      width: 100%;
      padding: 0px;
      padding-bottom: 3px;
      /*  width: 236px;
      height: 30px; */
      // line-height: 30px;
      //   border-bottom: 1px solid #E8E8E8;
      display: flex;
      // flex-wrap: wrap;
      .fon {
        width: 40%;
        text-align: right;
        margin-right: 20px;
        color: #ffffff;
      }
      .inb {
        width: 60%;
        color: #ffffff;
      }
    }
  }
}
</style>
